<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>{% block title %}Deep Research System{% endblock %}</title>
    <link rel="stylesheet" href="{{ url_for('research.serve_static', path='css/styles.css') }}">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/github-dark.min.css">
    {% block extra_head %}{% endblock %}
</head>
<body>
    <div class="app-container">
        <!-- Sidebar -->
        {% include 'components/sidebar.html' %}

        <!-- Main Content -->
        <main class="main-content">
            {% block content %}{% endblock %}

            <!-- Collapsible Log Panel is included in specific pages -->
        </main>
    </div>

    <!-- Mobile Tab Bar -->
    {% include 'components/mobile_nav.html' %}

    <!-- Common Templates -->
    {% block templates %}{% endblock %}

    <!-- Scripts -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.4.1/socket.io.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/marked@4.3.0/lib/marked.umd.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js" integrity="sha512-BNaRQnYJYiPSqHHDb58B0yaPfCu+Wgds8Gp/gU33kqBtgNS4tSPHuGibyoeqMV/TJlSKda6FXzoEyYGjTe+vXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

    <!-- URL Configuration (must load first) -->
    <script src="{{ url_for('research.serve_static', path='js/config/urls.js') }}"></script>

    <!-- Core JS -->
    <script src="{{ url_for('research.serve_static', path='js/services/formatting.js') }}"></script>
    <script src="{{ url_for('research.serve_static', path='js/services/ui.js') }}"></script>
    <script src="{{ url_for('research.serve_static', path='js/services/api.js') }}"></script>
    <script src="{{ url_for('research.serve_static', path='js/services/socket.js') }}"></script>
    <script src="{{ url_for('research.serve_static', path='js/services/keyboard.js') }}"></script>

    <!-- Shared Components -->
    <script src="{{ url_for('research.serve_static', path='js/components/logpanel.js') }}"></script>

    <!-- Page-specific Components -->
    {% block component_scripts %}{% endblock %}

    <!-- Page-specific JS -->
    {% block page_scripts %}{% endblock %}

    <script>
        // Configure marked to not use eval
        if (typeof marked !== 'undefined') {
            marked.setOptions({
                headerIds: false,
                mangle: false,
                smartypants: false
            });
        }

        // Configure html2canvas to avoid using eval if possible
        if (typeof html2canvas !== 'undefined') {
            window.html2canvas_noSandbox = true;
        }
    </script>

    <script src="{{ url_for('research.serve_static', path='js/components/settings_sync.js') }}"></script>
</body>
</html>
